<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>wangEditor ITArmy</title>
    <link rel="icon" type="image/x-icon" href="/static/images/logoIcon.icon">
    <!--<link rel="stylesheet" href=" /static/css/bootstrap.min.css" />-->
    <link rel="stylesheet" type="text/css" href="/static/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/static/css/wangeditor.css"/>
    <script type="text/javascript" src="/static/js/jquery-3.4.0.js"></script>
    <script type="text/javascript" src="/static/js/wangEditor.js"></script>
    <script type="text/javascript" src="/static/js/wangeditorPage.js"></script>
    <link rel="stylesheet" href="/static/css/amazeui.min.css">
    <link rel="stylesheet" href="/static/css/amazeui.cropper.css">
    <link rel="stylesheet" href="/static/css/custom_up_img.css">
    <script src="/static/js/amazeui.min.js" charset="utf-8"></script>
    <script src="/static/js/cropper.min.js" charset="utf-8"></script>
    <script src="/static/js/custom_up_img.js" charset="utf-8"></script>
</head>
<body th:style="'background-color : ' + ${session.config.color1}">
<!--顶部导航部分-->
<div class="nav">
    <!--导航居中样式-->
    <div class="navCenter">
        <div class="navLeft">
            <!--logo-->
            <div class="logo">
                <a href="/user/index"><img src="/static/images/logo.png"/></a>
            </div>
            <!--主页-->
            <div class="mainPage"><a href="/user/index">首页</a></div>

            <!--左侧未登录导航-->
            <!--下载App-->
            <div class="download" th:if="${session.user==null}"><a href="">下载App</a></div>
            <!--下载App隐藏部分-->
            <div class="downloadHide">
                <img src="/static/images/QRCode.jpg">
            </div>
            <!--左侧登录后导航将下载App换为关注和消息部分-->
            <!--关注-->
            <div class="attention" th:if="${session.user!=null}"><a href="/focus/focusInformation">关注</a></div>
            <!--消息-->
            <div class="information" th:if="${session.user!=null}"><a href="/message/getCommentMessage">消息</a></div>
            <div th:if="${session.user!=null}" style="display: inline-block"><div class="informationIcon" th:text="${session.message.all}"></div>
            </div>

            <!--搜索部分-->

            <div class="search">
                <form action="/serialize/selectBS" method="get">
                    <input type="text" name="name" class="navInput"/>
                    <button class="navBtn" type="submit"><i class="fa fa-search"></i></button>
                </form>
            </div>
        </div>

        <!--<a href="/user/sign">登录</a>-->
        <!--右侧导航-->
        <div class="navRight">
            <!--右侧未登录导航有登录注册部分-->
            <div class="signIn" th:if="${session.user==null}">
                <a href="/user/sign">登录</a>
            </div>

            <!--<ul>-->
            <!--<li><a th:if="${session.user==null}" href="/user/sign">登录</a></li>-->
            <!--<li><a th:if="${session.user!=null}" href="/user/loginOut">退出</a></li>-->
            <!--</ul>-->
            <div class="register" th:if="${session.user==null}"><a href="/user/registerPage">注册</a></div>
            <!--右侧已登录导航有个人信息图片部分-->
            <!--个人信息图片部分-->

            <div th:if="${session.user!=null}" class="myselfPic"><img th:src="${session.user.uHead}">
                <i class="fa fa-sort-down" id="myselfDown"></i>
                <i class="fa fa-sort-up" id="myselfUp"></i>
            </div>
            <!--登录后显示个人信息图片下拉菜单-->
            <ul class="myselfDownList" style="padding-left: 0;margin-top: 0">
                <a href="/user/PersonalPage">
                    <li><i class="fa fa-user"></i> 个人中心</li>
                </a>
                <a href="/user/personalData">
                    <li><i class="fa fa-drivers-license-o"></i> 我的资料</li>
                </a>
                <a href="/focus/focusInformation">
                    <li><i class="fa fa-check-square-o"></i> 我的收藏</li>
                </a>
                <a href="/message/getCommentMessage">
                    <li><i class="fa fa-group"></i> 我的消息</li>
                </a>
                <li class="loginOut" style="cursor: pointer"><i class="fa fa-reply-all"></i> 退出</li>
            </ul>
            <!--写文章按钮-->
            <a href="/test/editor">
                <div class="write">写文章</div>
            </a>

        </div>
    </div>
</div>
<div class="mainPageBody">
    <div class="leftWrite">
        <div class="writeCentre">创作中心</div>
        <a href="/test/editor"><div class="writeWord">写博客</div></a>
        <div class="writeLz">写连载</div>
        <ul class="writeLzUl" style="padding-left: 0">
            <a class=""><li class="writeLzNew">新建连载</li></a>
            <a href="/serialize/serializePage"><li class="writeLzMy">我的连载</li></a>
        </ul>
    </div>
    <div class="rightWrite">
        <div class="inputClass">
        <input class="title" type="text" placeholder="请输入文章标题" style="vertical-align: unset;"/>
            <span id="word">20</span>/20<br />
        </div>
        <div id="div1" class="toolbar"></div>
        <div id="div2" class="text">  <!--可使用 min-height 实现编辑区域自动增加高度-->
        </div>
        <div class="label">
            <div class="labelTitle">请选择文章标签：
                <div class="labelChange" style="display: inline-block">
                    <i class="fa fa-plus-square" id="plus"></i>
                    <i class="fa fa-minus-square" id="minus"></i>
                    <span style="color: #349EDF">选择标签</span>
                </div>
            </div>
            <div  class="labelArticle" >
                <div class="labelArticleUl" th:each="type : ${type}">
                <div class="labelArticleLi" th:text="${type.tName}"></div>
                <input class="labelArticleId" type="hidden" th:value="${type.tId}"/>
                </div>
            </div>
            <!--将点击选择的标签放到input里-->
            <input  type="hidden" class="inputId" />
            <!--将标签内容隐藏到input文本框内，之后动态获取，返回后台-->
            <input id="labelArticleLi" type="hidden" value=""/>

            <!--将文章内容隐藏到input文本框里，之后监听文本字数，返回后台-->

            <input type="hidden" value="" id="detail1"/>
            <input type="hidden" value="" id="detail1_num"/>
            <!--<p><span id="detail1_num">0</span></p>-->

            <div class="showBlog">发布博客</div>
            <div class="giveUpBlog">取消发布</div>
            </div>
        <!--模态框-->
        <!--确定发布博文模态框-->
        <!--<div class="bg-modelSure">　　-->
            <!--<div class='content'>-->
                <!--<h2>确定发布博文</h2>-->
                <!--<h3></h3>-->
                    <!--<button class="bg-model-sure" id="bg-model-sure1">确定</button>-->
                    <!--<button class="bg-model-ok" id="bg-model-ok1">取消</button>-->
            <!--</div>-->
        <!--</div>-->
        <!--&lt;!&ndash;取消发布博文模态框&ndash;&gt;-->
        <!--<div class="bg-modelOK">　　-->
            <!--<div class='content'>-->
                <!--<h2>取消发布博文</h2>-->
                <!--<h3 >xxxxxxxxxxxxxxxxx</h3>-->
                    <!--<button class="bg-model-sure" id="bg-model-sure2">确定</button>-->
                    <!--<button class="bg-model-ok" id="bg-model-ok2">取消</button>-->
            <!--</div>-->
        <!--</div>-->
        <div class="clear" style="clear: both"></div>
    </div>
    <div class="writeLzPage">
        <div class="writeLzPagePic">
                <div><a style="text-align: center; display: block;"  id="pic"></a></div>
                <!--图片上传框-->
                <div class="am-modal am-modal-no-btn up-frame-bj " tabindex="-1" id="doc-modal-1">
                    <div class="am-modal-dialog up-frame-parent up-frame-radius">
                        <div class="am-modal-hd up-frame-header">
                            <label>修改头像</label>
                            <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
                        </div>
                        <div class="am-modal-bd  up-frame-body">
                            <div class="am-g am-fl">
                                <div class="am-form-group am-form-file">
                                    <div class="am-fl">
                                        <button type="button" class="am-btn am-btn-default am-btn-sm">
                                            <i class="am-icon-cloud-upload"></i> 选择要上传的文件</button>
                                    </div>
                                    <input type="file" id="inputImage">
                                </div>
                            </div>
                            <div class="am-g am-fl" >
                                <div class="up-pre-before up-frame-radius">
                                    <img alt="" src="" id="image" >
                                </div>
                                <div class="up-pre-after up-frame-radius">
                                </div>
                            </div>
                            <div class="am-g am-fl">
                                <div class="up-control-btns">
                                    <span class="am-icon-rotate-left"  onclick="rotateimgleft()"></span>
                                    <span class="am-icon-rotate-right" onclick="rotateimgright()"></span>
                                    <span class="am-icon-check" id="up-btn-ok" ></span>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <!--加载框-->
                <div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="my-modal-loading">
                    <div class="am-modal-dialog">
                        <div class="am-modal-hd">正在上传...</div>
                        <div class="am-modal-bd">
                            <span class="am-icon-spinner am-icon-spin"></span>
                        </div>
                    </div>
                </div>

                <!--警告框-->
                <div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
                    <div class="am-modal-dialog">
                        <div class="am-modal-hd">信息</div>
                        <div class="am-modal-bd"  id="alert_content">
                            成功了
                        </div>
                        <div class="am-modal-footer">
                            <span class="am-modal-btn">确定</span>
                        </div>
                    </div>
                </div>
        </div>
        <div class="writeLzPageTitle" name="title">拟定连载标题：
            <input type="text" maxlength="10" class="inputTitle" style="vertical-align:baseline;"/></div>
        <div class="LzNews">我的连载简介：
            <textarea class="LzTextarea" name="introduction"></textarea>
        </div>
        <div class="writeLzPageBtn" type="submit">确定</div>
    </div>

<input  class="data" type="hidden"/>
<img src="" id="img" alt="">
</body>
<script type="text/javascript" src="/static/js/canves.js"></script>
</html>